<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="shortcut icon" href="https://s2.loli.net/2022/10/22/kwH5eq2NTmjL7Fr.png" type="image/x-icon">
    <title>锦囊”喵“计</title>
    <link rel="stylesheet" href="//unpkg.com/element-plus/dist/index.css" />
    <link rel="stylesheet" href="/static/css/questions.css">
    <script src="//unpkg.com/vue@3"></script>
    <script src="//unpkg.com/element-plus"></script>
    <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
</head>
<body>
    <div id="view">
        <el-row style="height:400px;" :gutter="20">
            <el-col :span="18" :offset="3">
                <div class="content">
                    <el-card :body-style="{ padding: '0px' }">
                        <div class="ques">{{question ? question.ques : '点击开始选择题目'}}</div>
                    </el-card>
                    <el-button size="large" type="primary" @click="start" style="margin-top: 20px;" :disabled="isStart">开始
                    </el-button>
                    <!-- <el-button size="large" type="danger" @click="pause" style="margin-top: 20px;" :disabled="!isStart">暂停
                    </el-button> -->
                    <div class="ques remainder">剩余题目:{{num}}</div>
                </div>
            </el-col>
        </el-row>

        <el-dialog title="题目信息" v-model="dialogVisible" width="50%" :before-close="handleClose">
            <div class="ques large">{{question.ques}}</div>
            <div class="ques answer" v-show="isShow" style="margin-top: 20px;">{{question.answer}}</div>
            <template #footer>
                <span class="dialog-footer">
                    <el-button size="large"  type="warning" @click="isShow = true">展开答案</el-button>
                    <el-button size="large"  type="primary" @click="confirm">确定</el-button>
                </span>
            </template>
        </el-dialog>
    </div>
    <script src="/static/js/question.js"></script>
</body>

</html>